﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图书管理系统</title>
    <link href="./dist/css/style.min.css" rel="stylesheet">
    <link href="./assets/libs/flot/css/float-chart.css" rel="stylesheet">
    <script src="./assets/libs/jquery/dist/jquery.min.js"></script>
    <script src="./assets/libs/popper.js/dist/umd/popper.min.js"></script>
    <script src="./assets/libs/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="./assets/libs/perfect-scrollbar/dist/perfect-scrollbar.jquery.min.js"></script>
    <script src="./assets/extra-libs/sparkline/sparkline.js"></script>
    <script src="./dist/js/waves.js"></script>
    <script src="./dist/js/sidebarmenu.js"></script>
    <script src="./dist/js/custom.min.js"></script>
    <script src="./assets/extra-libs/multicheck/datatable-checkbox-init.js"></script>
    <script src="./assets/extra-libs/multicheck/jquery.multicheck.js"></script>
    <script src="./assets/extra-libs/DataTables/datatables.min.js"></script>
<!--    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>-->
<!--    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>-->
    <link rel="stylesheet" type="text/css" href="./assets/extra-libs/multicheck/multicheck.css">
    <link rel="icon" type="image/png" sizes="16x16" href="./assets/images/favicon.png">
</head>
<body>
<div id="main-wrapper">
    <header class="topbar" data-navbarbg="skin5">
        <nav class="navbar top-navbar navbar-expand-md navbar-dark">
            <div class="navbar-header" data-logobg="skin5">
                <a class="nav-toggler waves-effect waves-light d-block d-md-none" href="javascript:void(0)"><i class="ti-menu ti-close"></i></a>
                <a class="navbar-brand" href="index.html">
                    <!-- Logo icon -->
                    <b class="logo-icon p-l-10">
                        <img src="./assets/images/logo-icon.png" alt="homepage" class="light-logo" />
                    </b>
                    <span class="logo-text">
                             <img src="./assets/images/logo-text.png" alt="homepage" class="light-logo" />
                        </span>
                </a>
                <a class="topbartoggler d-block d-md-none waves-effect waves-light" href="javascript:void(0)" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><i class="ti-more"></i></a>
            </div>

            <div class="navbar-collapse collapse" id="navbarSupportedContent" data-navbarbg="skin5">

                <ul class="navbar-nav float-left mr-auto">
                    <li class="nav-item d-none d-md-block"><a class="nav-link sidebartoggler waves-effect waves-light" href="javascript:void(0)" data-sidebartype="mini-sidebar"><i class="mdi mdi-menu font-24"></i></a></li>

                </ul>

                <ul class="navbar-nav float-right">

                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle text-muted waves-effect waves-dark pro-pic" href="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img src="./assets/images/users/1.jpg" alt="user" class="rounded-circle" width="31"></a>
                        <div class="dropdown-menu dropdown-menu-right user-dd animated">
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="index.html"><i class="fa fa-power-off m-r-5 m-l-5"></i> 注销</a>

                        </div>
                    </li>

                </ul>
            </div>
        </nav>
    </header>
    <aside class="left-sidebar" data-sidebarbg="skin5">
        <div class="scroll-sidebar">
            <nav class="sidebar-nav">
                <ul id="sidebarnav" class="p-t-30">
                    <li class="sidebar-item"><a class="sidebar-link waves-effect waves-dark sidebar-link" aria-expanded="false" href="manage.html"><i class="mdi mdi-view-dashboard"></i><span class="hide-menu">管理员主页</span></a></li>
                    <li class="sidebar-item"><a class="sidebar-link waves-effect waves-dark sidebar-link" aria-expanded="false" href="managequerybook.html"><i class="mdi mdi-view-dashboard"></i><span class="hide-menu">查询图书</span></a></li>
                    <li class="sidebar-item"><a class="sidebar-link waves-effect waves-dark sidebar-link" aria-expanded="false" href="usersearch.html"><i class="mdi mdi-view-dashboard"></i><span class="hide-menu">查询读者信息</span></a></li>
                    <li class="sidebar-item"><a class="sidebar-link waves-effect waves-dark sidebar-link" aria-expanded="false" href="addbook.html"><i class="mdi mdi-view-dashboard"></i><span class="hide-menu">添加图书</span></a></li>
                    <li class="sidebar-item"><a class="sidebar-link waves-effect waves-dark sidebar-link" aria-expanded="false" href="queryuserborrow.html"><i class="mdi mdi-view-dashboard"></i><span class="hide-menu">查询读者借阅</span></a></li>
                </ul>
            </nav>
        </div>
    </aside>
<div class="page-wrapper">
    <div class="page-breadcrumb">
        <div class="row">
            <div class="col-12 d-flex no-block align-items-center">
                <h4 class="page-title">用户搜索</h4>
            </div>
        </div>
    </div>
    <div class="container-fluid">

        <div class="row">
            <div class="col-12">
    <div class="card">
        <div class="card-body">
            <h5 class="card-title m-b-0">
                <input style="width: 400px" type="text" class="form-control" id="email" placeholder="请输入用户邮箱"/>
                <br/><button type="button" class="btn btn-outline-dark" onclick="query()">查找</button>
            </h5>
        </div>
    </div>
    <center>
        <div class="card" id="usertable" >
        <div class="card-body" style="width: 60%"><center>
        <h5 class="card-title">搜索结果</h5>
        <div class="table-responsive" >
        <table id="userinfo" width="60%" class="table table-striped table-bordered">
            <tr style="height: 30px">
                <th width="50%">邮箱:</th>
                <th id="e-mail"></th>
            </tr>
            <tr style="height: 30px">
                <th width="50%">姓名:</th>
                <th id="name"></th>
            </tr>
            <tr style="height: 30px">
                <th width="50%">性别：</th>
                <th id="sex"></th>
            </tr>
            <tr style="height: 30px">
                <th width="50%">年龄：</th>
                <th id="age"></th>
            </tr>
            <tr style="height: 30px">
                <th width="50%">账号状态：</th>
                <th id="con"></th>
            </tr>
            <tr style="height: 30px"></tr><tr></tr>
            <tr>
                <th style="text-align:left"><button class="btn btn-danger btn-sm" id="deletebutton"></button></th>
                <th style="text-align:right"><button class="btn btn-dark btn-sm"id="clockbutton"></button></th>
            </tr>
        </table>
        </div></center>
        </div>
        </div>
    </center>
            </div></div></div>
    <footer class="footer text-center"><br/><br/><br/><br/>create by weh <a target="_blank"></a>
    </footer>
</div>
</div>
    <script type="text/javascript">
        $("#usertable").hide();
    function query() {
        var email=$("#email").val();
        $.ajax({
            type:"GET",
            url:"/users/email/" + email,
            dateType:"json",
            success:function (result) {
                if(result=="")
                {
                    alert("该用户不存在。")
                }
                else{
                createlist(result)}
            }
        })
    }
    function createlist(data) {
        document.getElementById("e-mail").innerText = data.email
        document.getElementById("name").innerText=data.name
        document.getElementById("sex").innerText=data.sex
        document.getElementById("age").innerText=data.age
        var butt=""
        butt="<a class=\"button black\" onclick=\"deleteuser("+data.id+")\">删除用户</a>"
        $("#deletebutton").html(butt);
        if(data.ifBanned)
        {
            document.getElementById("con").innerText="已封禁"
            butt="<a class=\"button black\" onclick=\"lockuser("+data.id+")\">解封用户</a>"
            $("#clockbutton").html(butt);
        }
        else{
            document.getElementById("con").innerText="正常"
            butt="<a class=\"button black\" onclick=\"lockuser("+data.id+")\">封禁用户</a>"
            $("#clockbutton").html(butt);
        }
        $("#usertable").show();
    }
    function deleteuser(id) {
        var r=confirm("您确定要刪除该用戶吗？")
        if(r){
            $.ajax({
                type:"DELETE",
                url:"/users/"+id,
                dataType:"json"
            })
            alert("删除成功。")
            location.reload()
        }
        else{

        }
    }
    function lockuser(id) {
        $.ajax({
            type:"PUT",
            url:"/users/"+id,
            dataType:"json",
            success:function (result) {
                if(result)
                {
                    var email=$("#email").val();
                    $.ajax({
                        type:"GET",
                        url:"/users/email/" + email,
                        dateType:"json",
                        success:function (result) {
                            createlist(result)
                        }
                    })
                }
            }
        })
    }
</script>
</body>
</html>